<template>
    <header-footer :commonData="{$parent:userInfoData.$parent,indexLogo:userInfoData.indexLogo}">
        <div class="task_crumb index_width">
            <ul>
                <li class="f_left">当前位置：</li>
                <li class="f_left">
                    <router-link to="/home">首页></router-link>
                </li>
                <li class="f_left">
                    <router-link to="javascript:void(0)">用户中心</router-link>
                </li>
            </ul>
        </div>
        <div class="user_main mainToBottom index_width">
            <div id="userLeft" class="user_main_left f_left" :style="{height:userInfoData.userLeftHeight}">
                <div class="user_left_userinfo">
                    <!-- <img class="user_header_tou" src="/static/img/user/user_tou.png"> -->
                    <img class="user_header_tou" :src="loginInfo.portraitUrl?loginInfo.portraitUrl:'/static/img/home/home_user.png'"/>
                    <span class="user_username color333">用户名：{{String.isEmptyOrNUll(userInfoData.$parent.loginInfo.realName)?userInfoData.$parent.loginInfo.userName:userInfoData.$parent.loginInfo.realName}}</span>
                </div>
                <div class="user_item text_center" v-cloak>
                    <ul>
                        <li v-for="(item,index) in userLists" :key="index" :class="{user_item_li_active:userInfoData.userItemIndex==index}">
                            <router-link :to="item.url">
                                <span class="userItemSpan"><img :src="item.img"></span>
                                <span>{{item.title}}</span>
                            </router-link>
                        </li>

                    </ul>
                </div>
            </div>
            <slot></slot>
            <div class="clear"></div>
        </div>


    </header-footer>
</template>

<script>
    import headerFooter from "./../../components/cont_education/header_and_footer.vue"
    export default {
        props: ["userInfoData"],
        data: function() {
            return {
                imgUploadDialog: false,
                imageIdCard:"",//身份证照片
                imageUrl: "",//证件照
                indexItem: 0,
                loginInfo:{},
                userLists: [{
                        title: "个人信息",
                        url: "/cont_education/user/user_info",
                        img: "/static/img/user/user_icon_user.png"
                    },
                    {
                        title: "报名信息",
                        url: "/cont_education/user/apply_info",
                        img: "/static/img/user/user_icon_apply.png"
                    },
                    {
                        title: "下载中心",
                        url: "/cont_education/user/download",
                        img: "/static/img/user/mineTelephone.png"
                    },
                    {
                        title: "业务中心",
                        url: "/cont_education/user/business_center",
                        img: "/static/img/user/user_icon_listen_cert.png"
                    },
                    {
                        title: "我的证书",
                        url: "/cont_education/user/my_certificate",
                        img: "/static/img/user/user_icon_cert_info.png"
                    },
                    {
                        title: "发票模板",
                        url: "/cont_education/user/ticket_manage",
                        img: "/static/img/user/user_icon_listen_cert.png"
                    },
                    {
                        title: "修改密码",
                        url: "/cont_education/user/modify_pwd",
                        img: "/static/img/user/user_icon_update.png"
                    },
                    {
                        title: "更换手机",
                        url: "/cont_education/user/update_phone",
                        img: "/static/img/user/mineTelephone.png"
                    },
                    {
                        title: "在线反馈",
                        url: "/cont_education/user/feedback",
                        img: "/static/img/user/user_feedback.png"
                    }
                ]
            }
        },
        mounted: function() {
            this.loginInfo = this.$cookies.get('loginInfo');
        },
        methods: {

        },
        components: {
            headerFooter
        }
    }
</script>

<style scoped="scoped">

    .header_shadow {
        background: #3a89cc;
    }

    .header_out_img {
        background-image: url(/static/img/index/out_header_icon_b.png);
    }
</style>
